<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@taglib prefix="mvc" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="fmt" uri="http://www.springframework.org/tags" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>查看详情</title>
    <link rel="stylesheet" href="../../css/workflow/work/m/style.css">
    <link rel="stylesheet" type="text/css" href="../../css/workflow/m_reset.css">
    <script src="../../js/jquery/jquery-1.9.1.js"></script>
    <style>
        #basic_infor .table .td1{width: 130px;}
        #basic_infor .table .td1 div{min-height: 36px;}
        body{
            font-size: 14px;
        }
        .main2{background: #efefef;margin-top: 0px;}
        .file {
            position: relative;
            display: inline-block;
            background: #007df8;
            border: 1px solid #007df8;
            border-radius: 2px;
            padding: 0px 6px;
            overflow: hidden;
            color: #fff;
            text-decoration: none;
            text-indent: 0;
            line-height: 20px;
        }
        .uploadbox p{margin-bottom: 5px;color: #095de0;}
        #basic_infor .table .td1{width: 160px;}
        .done {
            height: auto;
            border-bottom: none;
            margin-bottom: 15px;
        }
        .td2 img{
            float: left;
            width: 58px;
            height: 58px;
            margin: 0 5px!important;
        }
        .type_done{border: none;background-color: #3984ff;padding: 13px 35px;font-size: 16px;margin-top: 20px;font-weight: bold}
        .tableplugin {padding: 10px 10px;}
        .uploadImg{
            cursor: pointer;
            /*position: absolute;*/
            width: 72px!important;
            height: 32px;
            line-height: 16px;
            text-align: center;
            left: 0px;
            bottom: 0px;
            font-size: 12px;
            white-space: normal;
            line-height: 16px;
        }
        .imgfileBox img{
            /*margin: 0 10px!important;*/
            width: 25px;
            height: 25px;
        }
       /* .imgfileBox:after{
            height: 32px;
        }*/
        ul {
            word-spacing: 0px;
        }
        .countersignatureContent,.countersignatureUserName,.countersignatureEditTime{
            font-size: 14px;
        }
        .listhead th{
            background-color: #F7F7F7;
            border: #dddddd 1pt solid;
            font-weight: bold;
        }
        .weight {
            font-weight: 300;
        }
        .head_toptitle {
            font-size: 14px;
            height: 14px;
            line-height: 14px;

        }
        .head_top{
            height: 97px;
            border-top:none;
            margin-top: 10px;
            padding:0px 15px;
        }
        #basic_infor .basic_infor_title {
            background: #f5f5f9;
            height: 32px;
            padding: 0 16px;
        }
        #basic_infor .basic_infor_title .basic_infor{
            line-height: 32px;
        }
        #basic_infor .basic_infor_title .icon{
            margin-top: 7px;
        }
        #basic_infor .table .td1 {
            position: relative;
            width: 110px;
            border-right: 1px solid #f7f7f7;
        }
        #basic_infor .table .td1 div {

            border-right:none;
        }
        #basic_infor .basic_infor_title .basic_infor{
            color:#333;
            font-weight: 300;
        }
        .td2 .imgSrc {
            width: 100%;
            height: auto;
        }
        input[type="radio"]{
            width: 17px;
            height: 17px;
        }
        .td2 .qrcode img {
            float: left;
            width: 100%;
            height: 100%;
        }
        #basic_infor .table .td2, #weituocontent table .td2 {
            position: relative;
            line-height: 36px;
            padding-left: 10px;
            padding-right: 5px;
            /*padding-top: 12px;*/
            padding-bottom: 0;
        }
        label {
            position: absolute;
            left: 9px;
            top: 15px;
            width: 20px;
            height: 20px;
            border-radius: 50%;
            border: 1px solid #e4e4e4;
            background: #fff;
        }
        #content input[data-type="checkbox"] {
            -webkit-appearance: checkbox;
            background: #fff!important;
            opacity: 0;
        }
        .bgweijinyong {
            /* background: #fffde9; */
            background: #fff9c1;
        }
        input:checked+label {
            background-color: #fe6d32;
            border: 1px solid #fe6d32;
        }
        input:checked+label::after {
            position: absolute;
            content: "";
            width: 5px;
            height: 10px;
            top: 3px;
            left: 6px;
            border: 2px solid #fff;
            border-top: none;
            border-left: none;
            transform: rotate(45deg);
        }
        
        .remove_sign {
            display: none !important;
        }
        .imgfileBox{
            display: block !important;
            margin: 5px;
            float: none !important;
            left: -15px;
        }
        /*********************评分控件start***********************************/
        .mark{
            display: inline-block;
            vertical-align: middle;
        }
        .star_list {
            height: 21px;
            margin: 50px;
            line-height: 21px;
        }

        .star_score {
            background: url(/img/workflow/form/stark2.png);
            width: 160px;
            height: 21px;
            position: relative;
        }

        .star_score a {
            height: 21px;
            display: block;
            text-indent: -999em;
            position: absolute;
            left: 0;
        }

        .star_score a.clibg {
            background: url(/img/workflow/form/stars2.png);
            left: 0;
        }
        /*********************评分控件end***********************************/
    </style>
</head>
<body style="display: none">
<input type="hidden" value="${sessionScope.module }" id="module">
<div class="head_top">
    <span  class="head_toptitle" style="color: #007cfd;font-size: 18px;font-weight: 900!important;padding-bottom: 10px;"><fmt:message code="workflow.th.liushui" />：<span id="flowRunId" style="font-weight:900!important;font-size: 16px;"></span></span>
    <ul>
        <li><span class="head_toptitle weight" id="flowName" style="font-weight:400;"><fmt:message code="workflow.th.processname" />：</span></li>
        <li><span class="head_toptitle weight" ><fmt:message code="workflow.th.ProcessInitiator" />：</span><span id="flowBeginUser" class="head_toptitle" style="font-weight: 400;color:#333;    margin-left: 2px;"></span></li>
        <li><span class="head_toptitle weight" ><fmt:message code="workflow.th.ProcessInitiation" />：</span><span id="flowBeginTime" class="head_toptitle" style="font-weight: 400; color:#333;   margin-left: 2px;"></span></li>
    </ul>
</div>
<div id="basic_infor">
    <div class="basic_infor_title">
        <img src="../../img/workflow/m/gapp_icon_no.png" alt="" class="icon">
        <div class="basic_infor"><fmt:message code="url.th.EssentialInformation" /></div>
        <div class="basic_infor_title_link">
            <a href="#"></a>
        </div>
    </div>
    <div class="table">
        <table  id="content" style="font-size:16px;">
        </table>
    </div>

    <div class="basic_infor_title">
        <img src="../../img/workflow/m/gapp_icon_no.png" alt="" class="icon">
        <div class="basic_infor"><fmt:message code="work.th.CountersignedArea" /></div>
        <div class="basic_infor_title_link">
            <a href="#"></a>
        </div>
    </div>
    <div class="signBox" style="-webkit-touch-callout:initial;  /*系统默认菜单被禁用*/ -webkit-user-select:auto; /*webkit浏览器*/-khtml-user-select:auto; /*早期浏览器*/-moz-user-select:auto;/*火狐*/-ms-user-select:auto; /*IE10*/user-select:auto;">
        <textarea rows="4" class="gapp_textarea" data-key="0" style="display: none" data-field-type="020000" data-must="0" data-is-write="1" name="COL101214452217682884218739" placeholder=""></textarea>
        <div class="hqbox" style="min-height: 40px;"></div>
    </div>
    <div class="basic_infor_title">
        <img src="../../img/workflow/m/gapp_icon_no.png" alt="" class="icon">
        <div class="basic_infor"><fmt:message code="email.th.file" /></div>
        <div class="basic_infor_title_link">
            <a href="#"></a>
        </div>
    </div>
    <div >
        <ul class="uploadbox">

        </ul>
    </div>
    <div style="width: 100%;height: 24px;display: none" class="choose_box">

    </div>
    <div class="photo_box" style="padding: 5px;">

    </div>

    <!--相关工作流程-->
    <div class="connect_work" style="display: none;">
        <div class="basic_infor_title">
            <img src="/img/workflow/m/gapp_icon_no.png" alt="" class="icon">
            <div class="basic_infor" style="font-size: 16px;color: #333;margin-left: 6px;font-weight: 300">相关流程</div>
            <div class="basic_infor_title_link">
                <a href="#"></a>
            </div>
        </div>
        <div style="padding: 5px 10px;">
            <table>
                <thead><tr><th style="min-width: 60px;">流程类型</th><th>流程名称</th></tr></thead>
                <tbody class="connect_work_table"></tbody>
            </table>
        </div>
    </div>

    <div class="done">
        <button class="type_done" id="lctbtn" style="padding: 13px 27px;margin-left: 27px;"><fmt:message code="workflow.th.chart" /></button>
        <button class="type_done" id="assignmentDetail" style="padding: 13px 27px;margin-left: 27px;display: none;">交办详情</button>
    </div>
</div>
<div class="lct" style="display: none">
    <div class="lct_title">
        <fmt:message code="workflow.th.chart" />
    </div>
    <div class="lct_body">
        <ul class="lct_info">
            <li><span class="head_toptitle weight" style="color:#0074ec;"><fmt:message code="workflow.th.SerialRegistration" /></span></li>
            <li><span class="head_toptitle weight" ><fmt:message code="workflow.th.HostedAdministrator" /></span><span class="head_toptitle" style="color: #73a282;margin-left: 2px;"><fmt:message code="workflow.th.second" /></span></li>
            <li><span class="head_toptitle weight" ><fmt:message code="workflow.th.StartedOn" />：</span><span class="head_toptitle" style="font-weight: 600;    margin-left: 2px;">2017-07-26 19:24</span></li>
        </ul>
    </div>
</div>

<script src="/js/template.js"></script>
<script src="/lib/laydate/laydate.js"></script>
<script src="/js/mustache.min.js"></script>
<script src="/js/base/base.js?20200116.1"></script>

<%--<script src="/lib/ueditor/ueditor.config.js" type="text/javascript" charset="utf-8"></script>--%>
<%--<script src="/lib/ueditor/ueditor.all.js" type="text/javascript" charset="utf-8"></script>--%>
<%--<script src="/lib/ueditor/UEcontroller.js" type="text/javascript" charset="utf-8"></script>--%>
<script src="/js/workflow/work/calculateFormitem.js?20201016.1"></script>
<script type="text/javascript" src="../../js/workflow/work/startScore.js"></script>
<script src="/js/workflow/work/workform.js?20201030.1"></script>
<script src="/js/workflow/work/m/H5websign_main.js?20190516.1"></script>
<script src="/js/workflow/work/m/workformh5PreView.js?20201030.1"></script>
<script src="/lib/jquery.form.min.js" ></script>
<script src="/lib/qrcode.js" ></script>
<script src="/js/jquery/jquery.cookie.js"></script>
<script src="/lib/img2blob/js/img2blob.js?201907311" type="text/javascript"></script>
<script type="text/javascript" src="/js/workflow/work/writeSign.js?20190821.1"></script>
<!-- 金格前瞻 begin -->

<%--<link rel="stylesheet" href="../../lib/kinggrid/dialog/artDialog/ui-dialog.css">--%>
<%--<link rel="stylesheet" href="../../lib/kinggrid/core/kinggrid.plus.css">--%>
<%--<script type="text/javascript" src="../../lib/kinggrid/core/kinggrid.min.js"></script>--%>
<%--<script type="text/javascript" src="../../lib/kinggrid/core/kinggrid.plus.min.js"></script>--%>
<%--<script type="text/javascript" src="../../lib/kinggrid/dialog/artDialog/dialog.js"></script>--%>

<!-- html签章核心JS -->
<%--<script type="text/javascript" src="../../lib/kinggrid/signature.min.js"></script>--%>
<!-- PC端附加功能 -->
<%--<script type="text/javascript" src="../../lib/kinggrid/signature.pc.min.js"></script>--%>
<!-- 移动端端附加功能 -->
<link rel="stylesheet" href="../../lib/kinggrid/core/kinggrid.plus.mobile.css">
<%--<script type="text/javascript" src="../../lib/kinggrid/signature.mobile.min.js"></script>--%>

<!-- 金格前瞻 end -->
<%--<script type="text/javascript" src="/js/workflow/work/macroSign.js?20191115.1" ></script>--%>
<script type="text/javascript" src="/js/workflow/work/macroSign.js?20191115.1" ></script>

<script>
    // function ready(){
    //     //alert(1111);
    // }
    /**********************与移动端对接webview的移动端base64回显函数*****************************/
    function DjSign(string,id,type,username){
        var url = 'data:image/png;base64,'+string;
        if(type == undefined||type == 'hw'){
            var classtype = 'hwImg';
        }else{
            var classtype = 'sealImg';
        }
        if(!username||username == workForm.tool.MacrosData.data.sYS_USERNAME){
            var deleteImg = 'deleteImg($(this),1)';
        }else{
            var deleteImg = 'deleteImg($(this),2)';
        }
        var url = 'data:image/png;base64,'+string;
        var imgSrc = '<img src="'+ url +'" class="imgSrc '+ classtype +'" atturl="'+ string +'" onclick="'+ deleteImg +'">';
        $('#'+id).parent().append(imgSrc);

    }
    /**********************结束*****************************/
    function anios(e){
        var url = e.attr('url');
        var name = e.attr('name');
        if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
            if($.getQueryString("type") == 'EWC'){
                window.open(url)
            }else{
                try{
                    window.webkit.messageHandlers.overLookFile.postMessage({'url':url,'name':name});
                }catch(error){
                    overLookFile(url,name);
                }
            }
        } else if (/(Android)/i.test(navigator.userAgent)) {
            if($.getQueryString("type") == 'EWC'){
                window.open(url)
            }else{
                Android.overLookFile(url,name);
            }
        } else {
            window.open(url)
        }
    }
    /**********************与移动端对接公文正文 传输已存在正文文件url得函数*****************************/
    function documentInitUrl(){
        if($.getQueryString("tableName") && $.getQueryString("tableName") == 'document'){
            $.ajax({
                url: "/document/selectDocById",
                type: "get",
                dataType: "json",
                data: {id: $.getQueryString("tabId"), randomNum: Math.random()},
                success: function (res) {
                    if (res.flag) {
                        //优先展示pdf，如果没有pdf，则展示word，没有word，直接传文字
                        if(res.object.aipAttUrl){
                            url = res.object.aipAttUrl;
                            url = encodeURI(url);
                            url = location.protocol +"//"+location.host+"/download?"+url;
                        }else{
                            if (!res.object.wordAttUrl) {
                                url = '该条公文未生成相应绑定的正文文件！';
                            } else {
                                url = res.object.wordAttUrl;
                                url = encodeURI(url);
                                url = location.protocol +"//"+location.host+"/download?"+url;
                            }
                        }
                        if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
                            try{
                                window.webkit.messageHandlers.InitUrl.postMessage({'url':url});
                            }catch(err){
                                InitUrl(url);
                            }
                        } else if (/(Android)/i.test(navigator.userAgent)) {
                            Android.InitUrl(url);
                        }
                    }
                }
            });
        }
    }
    /**********************结束*****************************/
    function anios1(e){
        if(e.attr('url').indexOf('http:') >-1){
            var url = e.attr('url');
        }else{
            if (window["context"] == undefined) {
                if (!window.location.origin) {
                    window.location.origin = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port: '');
                }
                window["context"] = location.origin;
            }
            var domain = document.location.origin;
            var url = domain+e.attr('url');
        }
        if(e.hasClass('fileupload_data')){
            var url = domain+'/download?'+e.attr('url');
        }
        var name = e.attr('names');
        if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
            try{
                window.webkit.messageHandlers.overLookFile.postMessage({'url':url,'name':name});
            }catch(error){
                overLookFile(url,name);
            }
        } else if (/(Android)/i.test(navigator.userAgent)) {
            Android.overLookFile(url,name);
        }
    }
    $(function () {
        var sign_arr=[];
        //声明下签章、手写控件START
        if($('input[data-type=djsign]').length != 0){
            function DWebSignSealFUN(){
                for(var i=0;i<$('input[data-type=djsign]').length;i++){
                    sign_arr.push($('input[data-type=djsign]').eq(i).attr('name'));
                }
                LoadSignDataH5(sign_arr);
            }
            DWebSignSealFUN()
        }
        /*************处理radio类型input在disabled下无法修改样式的问题 通过将已选中的radio 去除掉disabled解决 仅限于工作流-查看详情页面******************/
        var length = $('input[type=radio]').length;
        if(length != 0){
            for(var i=0;i<length;i++){
                if($('input[type=radio]').eq(i).attr('checked') == 'checked'){
                    $('input[type=radio]').eq(i).removeAttr('disabled');
                }
            }
        }
        function auto() {
            var width = $('#word').width() / 2;
            $('#word .table td').css('width', '' + width + '');
            var width1 = width - 62;
            $('#word .action').css('width', '' + width1 + '');
        }

        function dateclick(e) {
            laydate({
                elem: '#' + $(e).attr('target'),
                format: 'YYYY-MM-DD hh:mm:ss'
            });
        }

        function uploadimg(data) {
            $('#picture').val(data);
            $('#picture').attr('value', data);
        }

        $('#fileUpload').change(function () {
            var e = this;
            $('#uploadForm').ajaxSubmit({
                dataType:'json',
                success:function (res) {
                    if(res.msg == 'OK'){
                        if( res.obj[0].isImage ==0){
                            readURL(e);
                        }else{
                            url = res.obj[0].attUrl;
                            console.log(url);
                            var str = '<li><a href="#"><span>'+ res.obj[0].attachName+'</span></a></li>';
                            $('.uploadbox').append(str);
                        }
                    }

                }
            })
            function readURL(input) {
                if (input.files && input.files[0]) {
                    var reader = new FileReader();
                    reader.onload = function (e) {

                        var img = '<img id="blah" src="'+e.target.result+'" alt="<fmt:message code="workflow.th.DisplayUploaded" />" style="width:50px;height:50px;">';
                        $('.photo_box').append(img);
                    }

                    reader.readAsDataURL(input.files[0]);

                }
            }
        });

        // 查看交办详情
        $('#assignmentDetail').click(function(){

            var viewUser = $('#viewUserName').attr('user_id') ||'';
            var thisrunName= $('.num').attr('thisrunName')||'';

            var url = '/flowAssign/flowAssignDetail?';
            url += 'runId=' + globalData.runId + '&flowId=' + globalData.flowId + '&tableName=' + globalData.tableName + '&tabId=' + globalData.tabId + '&prcsId=' +globalData.flowRunPrcs.prcsId+ '&currentPrcsId=' +globalData.flowProcesses.prcsId+ '&id=' +globalData.flowRunPrcs.id+ '&runName=' +globalData.flowRun.runName+ '&prcsName=' +globalData.flowProcesses.prcsName+ '&flowPrcs=' +globalData.flowRunPrcs.flowPrcs+ '&feedback=' + (globalData.feedback ? globalData.feedback : '0') + '&viewUser=' +viewUser + '&thisrunName='+thisrunName;

            if($.getQueryString("type") == 'EWC'){
                window.location.href = url;
            }else{
                if(/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
                    try{
                        window.webkit.messageHandlers.lookFlowChart.postMessage({'url':url});
                    }catch(err){
                        lookFlowChart(url);
                    }
                }else if(/(Android)/i.test(navigator.userAgent)){
                    Android.lookFlowChart(url);
                }
            }
        });

        // 查看关联工作流程
        $(document).on('click', '.open_flow_work',function(){
            var flowId = $(this).attr('flowid');
            var runId = $(this).attr('runid');
            if($.getQueryString("type") == 'EWC'){
                window.location.href = '/workflow/work/workformPreView?flowId=' + flowId + '&flowStep=&prcsId=&runId=' + runId + '&formInfo=formInfo';
            }else{
                if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
                    try{
                        window.webkit.messageHandlers.formInfoUrlLink.postMessage({'url':'/workflow/work/workformh5PreView?flowId=' + flowId + '&flowStep=&prcsId=&runId=' + runId + '&formInfo=formInfo','name':'流程详情'});
                    }
                    catch(err) {
                        formInfoUrlLink('/workflow/work/workformh5PreView?flowId=' + flowId + '&flowStep=&prcsId=&runId=' + runId + '&formInfo=formInfo','流程详情');
                    }
                } else if (/(Android)/i.test(navigator.userAgent)) {
                    Android.formInfoUrlLink('/workflow/work/workformh5PreView?flowId=' + flowId + '&flowStep=&prcsId=&runId=' + runId + '&formInfo=formInfo','流程详情');
                }
            }
        });
    
        // 查看新闻内容
        $(document).on('click', '.edit_news_content', function () {
            var newsId = $(this).attr('newsid');
            layer.open({
                type: 1,
                title: '新闻内容',
                area: ['100%', '100%'],
                content: '<div><style>#newsContent p {margin: 8px 0;font-size: 12px;color: #444;line-height: 20px;} #newsContent img { width: 100%;height: 100%;}</style><div id="newsContent" style="width: 100%; height: 100%;"></div></div>',
                success: function () {
                    $.get('/news/getOneById', {newsId: newsId, changId: "1"}, function (res) {
                        if (res.flag) {
                            $('#newsContent').html(res.object.content);
                        }
                    });
                }
            });
        });
    });
</script>
</body>
</html>